<template>
  <view class="form-container">
    <u-form :model="form" :rules="rules" ref="form">
      <Sign>2-1.住房情况</Sign>
      <u-form-item prop="housing_source" borderBottom>
        <view class="title">住房来源：</view>
        <u-radio-group v-model="form.housing_source" placement="column">
          <u-radio
            :customStyle="{ marginBottom: '40rpx' }"
            v-for="(item, index) in radioListGroup.housing_source_list"
            :key="index"
            :label="item.name"
            :name="item.name"
          ></u-radio>
        </u-radio-group>
      </u-form-item>
      <u-form-item prop="housing_money" label="住房金额/租金：" borderBottom label-width="120">
        <u-input type="digit" v-model="form.housing_money" border="none" placeholder="请输入金额"></u-input>
      </u-form-item>
      <u-form-item prop="housing_area" label="住房面积：" borderBottom label-width="80">
        <u-input type="digit" v-model="form.housing_area" border="none" placeholder="请输入面积(m)"></u-input>
      </u-form-item>
      <u-form-item prop="housing_area" label="住房月租：" borderBottom label-width="80">
        <u-input type="digit" v-model="form.monthlyRental" border="none" placeholder="请输入金额"></u-input>
      </u-form-item>
      <u-form-item prop="housing_area" label="住房购置日期：" borderBottom label-width="120">
        <u-input v-model="form.house_time" border="none" placeholder="格式：2022-02-02"></u-input>
      </u-form-item>
      <u-form-item prop="other_housing" borderBottom>
        <view class="title">是否在现有住房以外购置（租赁）商品房或商铺？</view>
        <u-radio-group v-model="form.other_housing" placement="column">
          <u-radio
            :customStyle="{ marginBottom: '40rpx' }"
            v-for="(item, index) in radioListGroup.other_housing_list"
            :key="index"
            :label="item.name"
            :name="item.name"
          ></u-radio>
        </u-radio-group>
      </u-form-item>
      <u-form-item prop="housing_area" label="住房以外购置（租赁）商品房时间：" borderBottom label-width="130">
        <u-input v-model="form.other_housing_time" border="none" placeholder="没有请填无，格式(2022-02-20)"></u-input>
      </u-form-item>
      <u-form-item prop="housing_area" label="目前价值：" borderBottom label-width="80">
        <u-input type="digit" v-model="form.other_house_new_money" border="none" placeholder="请输入金额"></u-input>
      </u-form-item>
      <u-form-item prop="housing_area" label="目前月租：" borderBottom label-width="80">
        <u-input type="digit" v-model="form.other_house_monthlyRental" border="none" placeholder="请输入金额"></u-input>
      </u-form-item>

      <u-form-item prop="other_house_money" label="花费金额：" borderBottom label-width="80">
        <u-input type="digit" v-model="form.other_house_money" border="none" placeholder="请输入金额"></u-input>
      </u-form-item>
      <u-form-item prop="other_housing" borderBottom>
        <view class="title">购置（租赁）商品房或商铺面积？</view>
        <u-radio-group v-model="form.other_house_area" placement="column">
          <u-radio
            :customStyle="{ marginBottom: '40rpx' }"
            v-for="(item, index) in radioListGroup.other_house_area_list"
            :key="index"
            :label="item.name"
            :name="item.name"
          ></u-radio>
        </u-radio-group>
      </u-form-item>

      <Sign>2-2.家庭耐用品</Sign>
      <u-form-item prop="car_number" label="轿车：" borderBottom label-width="70">
        <u-input type="digit" v-model="form.car_number" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="transport_number" label="运输车：" borderBottom label-width="70">
        <u-input type="digit" v-model="form.transport_number" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="airconditioner_number" label="空调：" borderBottom label-width="70">
        <u-input type="digit" v-model="form.airconditioner_number" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="refrigerator_number" label="冰箱：" borderBottom label-width="70">
        <u-input type="digit" v-model="form.refrigerator_number" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="washing_number" label="洗衣机：" borderBottom label-width="70">
        <u-input type="digit" v-model="form.washing_number" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="tv_number" label="电视机：" borderBottom label-width="70">
        <u-input type="digit" v-model="form.tv_number" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="motorcycle_number" label="摩托车：" borderBottom label-width="70">
        <u-input type="digit" v-model="form.motorcycle_number" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="electric_number" label="电动车：" borderBottom label-width="70">
        <u-input type="digit" v-model="form.electric_number" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="computer_number" label="电脑：" borderBottom label-width="70">
        <u-input type="digit" v-model="form.computer_number" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="phone_number" label="手机：" borderBottom label-width="70">
        <u-input type="digit" v-model="form.phone_number" border="none"></u-input>
      </u-form-item>

      <Sign>2-3.土地林地资源</Sign>
      <u-form-item prop="house_site_number" borderBottom>
        <view class="title">家中宅基地数：</view>
        <u-radio-group v-model="form.house_site_number" placement="column">
          <u-radio
            :customStyle="{ marginBottom: '40rpx' }"
            v-for="(item, index) in radioListGroup.house_site_number_list"
            :key="index"
            :label="item.name"
            :name="item.name"
          ></u-radio>
        </u-radio-group>
      </u-form-item>

      <u-form-item prop="have_arable_land" label="自有耕地面积：" borderBottom label-width="120">
        <u-input v-model="form.have_arable_land" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="contract_arable_land" label="承包耕地面积：" borderBottom label-width="120">
        <u-input v-model="form.contract_arable_land" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="roam_arable_land" label="流转耕地面积：" borderBottom label-width="120">
        <u-input v-model="form.roam_arable_land" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="actual_planing_arable_land" label="实际耕地面积：" borderBottom label-width="120">
        <u-input v-model="form.actual_planing_arable_land" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="woodland_area" label="现有林地面积：" borderBottom label-width="120">
        <u-input v-model="form.woodland_area" border="none"></u-input>
      </u-form-item>

      <Sign>2-4.社会资源资产</Sign>
      <u-form-item prop="mon_communication_fee" label="通讯费用：" borderBottom label-width="100">
        <u-input v-model="form.mon_communication_fee" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="mon_electricity_fee" label="电费：" borderBottom label-width="80">
        <u-input v-model="form.mon_electricity_fee" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="borrow_money_number" borderBottom>
        <view class="title">愿意借钱人数：</view>
        <u-radio-group v-model="form.borrow_money_number" placement="column">
          <u-radio
            :customStyle="{ marginBottom: '40rpx' }"
            v-for="(item, index) in radioListGroup.borrow_money_number_list"
            :key="index"
            :label="item.name"
            :name="item.name"
          ></u-radio>
        </u-radio-group>
      </u-form-item>
      <u-form-item prop="village_cadres_number" label="本村干部数量：" borderBottom label-width="150">
        <u-input v-model="form.village_cadres_number" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="other_village_cadres_number" label="村外干部数量：" borderBottom label-width="150">
        <u-input v-model="form.other_village_cadres_number" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="commercial_insurance_number" label="商业保险人数：" borderBottom label-width="150">
        <u-input v-model="form.commercial_insurance_number" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="commercial_insurance_outcome" label="商业保险支出：" borderBottom label-width="150">
        <u-input v-model="form.commercial_insurance_outcome" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="social_welface_organization_number" label="社会公益人数：" borderBottom label-width="150">
        <u-input v-model="form.social_welface_organization_number" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="policy_borrow_number" label="政府借贷人数：" borderBottom label-width="150">
        <u-input v-model="form.policy_borrow_number" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="policy_borrow_money" label="政府借贷金额：" borderBottom label-width="150">
        <u-input v-model="form.policy_borrow_money" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="friend_borrow_number" label="亲戚借钱人数：" borderBottom label-width="150">
        <u-input v-model="form.friend_borrow_number" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="friend_borrow_money" label="亲戚借钱金额：" borderBottom label-width="150">
        <u-input v-model="form.friend_borrow_money" border="none"></u-input>
      </u-form-item>
      <u-form-item prop="total_liabilities_money" label="负载总钱数：" borderBottom label-width="150">
        <u-input v-model="form.total_liabilities_money" border="none"></u-input>
      </u-form-item>
    </u-form>
  </view>
</template>

<script>
export default {
  props: {},
  data: () => ({
    form: {
      housing_source: "自建",
      housing_money: "0",
      housing_area: "0",
      monthlyRental: "0", // 新增
      house_time: "", // 新增
      other_housing: "没有",
      other_housing_time: "无",
      other_house_new_money: "0",
      other_house_monthlyRental: "0",
      other_house_money: "0",
      other_house_area: "无",
      car_number: "0",
      transport_number: "0",
      airconditioner_number: "0",
      refrigerator_number: "0",
      washing_number: "0",
      tv_number: "0",
      motorcycle_number: "0",
      electric_number: "0",
      computer_number: "0",
      phone_number: "0",
      house_site_number: "无",
      have_arable_land: "0",
      contract_arable_land: "0",
      roam_arable_land: "0",
      actual_planing_arable_land: "0",
      woodland_area: "0",
      mon_communication_fee: "0",
      mon_electricity_fee: "0",
      borrow_money_number: "很多",
      village_cadres_number: "0",
      other_village_cadres_number: "0",
      commercial_insurance_number: "0",
      commercial_insurance_outcome: "0",
      social_welface_organization_number: "0",
      policy_borrow_number: "0",
      policy_borrow_money: "0",
      friend_borrow_number: "0",
      friend_borrow_money: "0",
      total_liabilities_money: "0",
    },
    rules: [],
    radioListGroup: {
      housing_source_list: [{ name: "自建" }, { name: "购买" }, { name: "安置" }, { name: "租房" }, { name: "借住" }],
      other_housing_list: [{ name: "没有" }, { name: "有" }],
      other_house_area_list: [{ name: "无" }, { name: "80m以下" }, { name: "80~120m" }, { name: "120m以上" }],
      house_site_number_list: [{ name: "无" }, { name: "1块" }, { name: "2块" }, { name: "2块以上" }],
      borrow_money_number_list: [{ name: "很多" }, { name: "较多" }, { name: "一般" }, { name: "较少" }, { name: "很少" }],
    },
  }),
  computed: {},
  methods: {},
  watch: {},

  // 组件周期函数--监听组件挂载完毕
  mounted() {},
}
</script>

<style lang="scss" scoped>
.form-container {
  box-sizing: border-box;
  padding: 20rpx;
  border-radius: 20rpx;
  background-color: #fff;

  .title {
    font-size: 32rpx;
    color: $uni-color-paragraph;
    font-weight: bold;
    margin-bottom: 40rpx;
  }
}
</style>
